<section id="preview-list">
  <h3 class="preview-title font-16">活动&福利发布</h3>
  <div class="preview-list-wrap">
    <div class="box-o-shadow ptb-10 mt-15 br-4">
      <h3 class="text-center font-16" style="margin:15px 0 0;font-weight:bold;">{{ data.title }}</h3>
      <div class="mt-15 html-preview pl-12 pr-12"></div>
    </div>
    <div class="box-o-shadow ptb-10 mt-15 br-4">
      <h3 class="font-16 color-666 pl-12" style="margin:5px 0 0;">附件</h3>
      <ul class="pl-12 mt-10">
        <li v-for="item in data.files">
          <a :href="item.url" :download="item.name" class="color-999 line-height-34">
            <span class="mr-5" :class="{'icon-file': item.type == 'file', 'icon-picture': item.type == 'pic'}"></span>
            {{item.name}}
          </a>
        </li>
      </ul>
    </div>
    
  </div>
  <div class="text-center mt-15 pb-10">
    <button class="n-btn-primary br-4" @click="back">返回</button>
  </div>
</section>
<script src="modules/workbench/scripts/jwkprevew.js" charset="utf-8"></script>
<style media="screen">
  body {
    background: #fff !important;
  }
  .box-o-shadow {
    box-shadow:0px 0px 6px 0px rgba(177,177,177,0.5);
  }
  .preview-title {
    width: 100%;
    height:68px;
    line-height: 68px;
    text-align: center;
    background:rgba(86,94,153,1);
    color: #fff;
    margin: 0;
  }
  .preview-list-wrap {
    width: 750px;
    margin: 0 auto;
  }
  .html-preview img {
    display: block;
    margin:0 auto;
    max-width: 100%;
    max-height: auto;
  }
  .html-preview table th,.html-preview table td {
    border: 1px solid #ccc !important;
    border-bottom: 2px solid #ccc !important;
    text-align: center;
  }
</style>
